window.onload = function () {
	var ct_cLeft = document.querySelector('.ct_cLeft');
	var ulBox = ct_cLeft.querySelector('ul:first-of-type');
	// 获得侧边栏的高度
	var leftHeight = ct_cLeft.offsetHeight;
	// 获得侧边栏所有内容的高度
	var ulBoxHeight = ulBox.offsetHeight;
	// 设置静止状态下的最大top值
	var maxTop = 0;
	// 设置静止状态下的最小top值
	var minTop = leftHeight - ulBoxHeight;
	// 设置滑动状态下的最大top值
	var maxBoundTop = maxTop + 100;
	// 设置滑动状态下的最小top值
	var minBoundTop = minTop - 100;
	// 获得所有的li
	var lis = ulBox.querySelectorAll('li');
	// clientX clientY 是距离页面的距离
	// offsetHeight offsetWidth 是是自身的宽高

	// 给ulBox添加touch时间
	var startY = 0,
		moveY = 0,
		distanceY = 0,
		current = 0;
	ulBox.addEventListener('touchstart', function (e) {
		startY = e.targetTouches[0].clientY;
	});
	ulBox.addEventListener('touchmove', function (e) {
		moveY = e.targetTouches[0].clientY;
		distanceY = moveY - startY;
		if (current + distanceY > maxBoundTop || current + distanceY < minBoundTop) {
			return;
		}
		ulBox.style.transition = 'none';
		ulBox.style.top = (distanceY + current) + 'px';
	});
	ulBox.addEventListener('touchend', function () {
		if (current + distanceY < minTop) {
			current = minTop;
			ulBox.style.transition = 'top 0.5s';
			ulBox.style.top = minTop + 'px';
		} else if (current + distanceY > maxTop) {
			current = maxTop;
			ulBox.style.transition = 'top 0.5s';
			ulBox.style.top = maxTop + 'px';
		} else {
			current += distanceY;
		}
	});

	for (var i = 0; i < lis.length; i++) {
		lis[i].index = i;
	}

	// 添加单击事件
	/*itcast.tap(ulBox, function (e) {
		// 清除所有li元素的样式
		for (var i = 0; i < lis.length; i++) {
			lis[i].classList.remove('active');
		}
		// 为当前li元素添加样式
		// 获得当前li元素
		var li = e.target.parentNode;
		// 获取li的高度
		var liHeight = li.offsetHeight;
		li.classList.add('active');
		var index = li.index;
		if (-liHeight * index < minTop) {
			ulBox.style.top = minTop + 'px';
			current = minTop;
		} else {
			ulBox.style.top = -liHeight * index + 'px';
			current = -liHeight * index;
		}
	});*/
	/*$(ulBox).on('tap', function (e) {
		// 清除所有li元素的样式
		for (var i = 0; i < lis.length; i++) {
			lis[i].classList.remove('active');
		}
		// 为当前li元素添加样式
		// 获得当前li元素
		var li = e.target.parentNode;
		// 获取li的高度
		var liHeight = li.offsetHeight;
		li.classList.add('active');
		var index = li.index;
		if (-liHeight * index < minTop) {
			ulBox.style.top = minTop + 'px';
			current = minTop;
		} else {
			ulBox.style.top = -liHeight * index + 'px';
			current = -liHeight * index;
		}  currentY=-index*liHeight;
	});*/
	if ('addEventListener' in document) {
        document.addEventListener('DOMContentLoaded', function() {
            FastClick.attach(document.body);
        }, false);
    }
	ulBox.addEventListener('click', function (e) {
		// 清除所有li元素的样式
		for (var i = 0; i < lis.length; i++) {
			lis[i].classList.remove('active');
		}
		// 为当前li元素添加样式
		// 获得当前li元素
		var li = e.target.parentNode;
		// 获取li的高度
		var liHeight = li.offsetHeight;
		li.classList.add('active');
		var index = li.index;
		if (-liHeight * index < minTop) {
			ulBox.style.top = minTop + 'px';
			current = minTop;
		} else {
			ulBox.style.top = -liHeight * index + 'px';
			current = -liHeight * index;
		}  currentY=-index*liHeight;
	});
}